import React, { memo, useEffect } from 'react'
import { increAction } from '../store/counter'
import { getDataListAction } from '../store/datalist'
import { useDispatch, useSelector, shallowEqual } from 'react-redux'

const Home = memo(() => {
  const { counter, dataList } = useSelector(state => ({ counter: state.counter, dataList: state.dataList }), shallowEqual)
  const dispatch = useDispatch()
  useEffect(() => {
    dispatch(getDataListAction())
  }, [dispatch])
  console.log('Home组件被渲染了')
  return (
    <>
      <h1>home4中当前计数{counter}</h1>
      <div>{dataList}</div>
      <button onClick={() => dispatch(increAction())}>Home4 + 1</button>
    </>
  )
})

export default Home
 